<template>
	<section v-if="data.paper">
		<view class="xc-block" v-for="item in data.questionjson">
			<section v-if="!item.__answer__">
				<xa-question-header v-if="item.__config__.tag=='question-header'" :field="item" :paper="data.paper" />
				<xa-question-footer v-if="item.__config__.tag=='question-footer'" :field="item" :paper="data.paper" />
				<xa-question-bodytext v-if="item.__config__.tag=='question-bodytext'" :field="item"
					:paper="data.paper" />
			</section>
			<section v-if="item.__answer__">
				<view class="xp-title" :style="data.paper.themequestionfont+';'+data.paper.themequestiondivstyle">
					<view v-if="data.paper.themequestionnoshow=='Y'" class="xp-inline">{{item.no}}. </view>
					<view class="xp-inline">{{item.csmwjtitle.value}}</view>
					<view class="xp-inline xp-red" v-if="item.csmwjrequired && item.csmwjrequired.value===true"> (*)
					</view>
				</view>
				<view class="xp-question-body">
					<xa-question-input ref="xaquestion" v-if="item.__config__.tag=='question-input'" :field="item"
						:paper="data.paper" @change="onSaveorsubmituserpaper" />
					<xa-question-radio-group ref="xaquestion" v-if="item.__config__.tag=='question-radio-group'"
						:field="item" :paper="data.paper" @change="onSaveorsubmituserpaper" />
					<xa-question-checkbox-group ref="xaquestion" v-if="item.__config__.tag=='question-checkbox-group'"
						:field="item" :paper="data.paper" @change="onSaveorsubmituserpaper" />
					<xa-question-select-group ref="xaquestion" v-if="item.__config__.tag=='question-select-group'"
						:field="item" :paper="data.paper" @change="onSaveorsubmituserpaper" />
					<xa-question-checkbox-yn ref="xaquestion" v-if="item.__config__.tag=='question-checkbox-yn'"
						:field="item" :paper="data.paper" @change="onSaveorsubmituserpaper" />
				</view>
				<view class="xp-question-error">
					{{item.errmsg}}
				</view>
			</section>


		</view>

		<view style="font-size: 28rpx;color: rgb(0, 51, 51);font-weight: bold;margin-left: 20rpx;">现场照片<span
				style="color: red;">（*）</span></view>
				
		<view style="margin-left: 20rpx;">
			<uv-form-item prop="image">
				<xc-uv-upload v-model="control2.form.image" maxCount="8"></xc-uv-upload>
			</uv-form-item>
		</view>
		
		<view class="xc-block">
			<button :style="data.paper.themesubmitdivstyle" @click="control_submit">
				{{(data.paper.themesubmitstring!=null&&data.paper.themesubmitstring!='')?data.paper.themesubmitstring:$t('xc.btn_submit')}}
			</button>
		</view>

	</section>
</template>
<script>
	import config from "@/config/config.js";
	import xcHttpUtils from '@/library/xcore/js/XcHttpUtils.js';
	import xcViewUtils from '@/library/xcore/js/XcViewUtils.js';
	import {
		xsStringUtils,
		xsDateUtils,
		xsDatetimeUtils,
		xsArrayUtils
	} from 'xstack-for-javascript';


	export default {
		props: {
			data: {
				type: Object,
				default: [],
			},
			preview: {
				type: Boolean,
				default: false,
			}
		},
		watch: {
			'data': {
				handler(newVal, oldVal) {
					let that = this;
					that.public_show();
				},
			},
		},
		emits: ['reset_parent'],
		data() {
			return {
				image: [],
				config: config,
				xsStringUtils: xsStringUtils,
				xsDateUtils: xsDateUtils,
				sp: {},
				sr: {},
				control: {
					index: 1,
					now: null,
				},
				control2: {
					form: {
						image: '',
						type: 1
					}
				}

			}
		},
		created() {
			let that = this;
			that.xinit();
		},
		mounted() {
			let that = this;
			that.$nextTick(function() {
				that.public_show();
			});
		},
		methods: {
			xinit() {
				let that = this;
				that.control.now = xsDatetimeUtils.getCurrenTimestamp();
			},
			public_show() {
				let that = this;

				that.data.paper = that.data.paper;
				that.data.questionjson = that.data.questionjson;
				that.data.usercount = that.data.usercount;
				that.data.doing_userpaper = that.data.doing_userpaper;

			},
			public_reset() {
				let that = this;
				that.public_show();
			},
			onSaveorsubmituserpaper() {
				let that = this;
				if (that.preview === false) {
					that.$uv.debounce(this._saveorsubmituserpaper, 100);
				}
			},
			control_submit() {
				let that = this;

				let iserr = false;
				for (let index in that.$refs['xaquestion']) {
					let ref = that.$refs['xaquestion'][index];
					if (ref.public_validate() != null) {
						ref.control_change();
						iserr = true;
					}
				}
				if (iserr === true) {
					xcViewUtils.toast(that.$t('xp.paper.msg_answer_submit_error'));
					return;
				}
				if (that.preview === false) {

					that._saveorsubmituserpaper("submit");
				} else {
					xcViewUtils.message_error('当前为预览模式,无法提交');
				}
			},

			/**
			 * operate  submit=提交,save=保存,forcesubmit=强制提交
			 */
			_saveorsubmituserpaper(operate) {
				let that = this;
				operate = (operate) ? operate : "save";

				console.log(222, that.control2.form.image)

				let ret = [];
				for (let index in that.data.questionjson) {
					let field = that.data.questionjson[index];
					if (field.__answer__) {
						ret.push({
							id: field.id,
							__answer__: {
								value: field.__answer__.value
							}
						});
					}
				}

				xcHttpUtils.post('csmwj/xpmy_api/saveorsubmituserpaper', {
					'id': that.data.paper.id,
					'userpaperid': that.data.doing_userpaper.id,
					'usedsecond': (xsDatetimeUtils.getCurrenTimestamp() - that.control.now),
					'operate': operate,
					'image': that.control2.form.image,
					values: ret
				}, function(res) {
					if (operate == 'submit' || operate == 'forcesubmit') {
						that.$emit("reset_parent");
					}
				}, function(err) {
					console.log('--', err);
				}, {
					loading: (operate === "save") ? false : true,
				})
			},
		}
	}
</script>

<style lang="scss">
	.xp-title {}

	.xp-inline {
		display: inline;
	}

	.xp-red {
		color: red;
	}

	.xp-question-body {
		padding-top: $uni-spacing-col-base;
	}

	.xp-question-error {
		color: red;
		padding-top: $uni-spacing-col-sm;
	}
</style>